import { useState } from 'react';
import { Breadcrumb, Switch, Dropdown } from 'antd'
import type { MenuProps } from 'antd';
import { MenuFoldOutlined } from '@ant-design/icons'
import style from './index.module.less'
const NavHeader = () => {
    const items = [
        {
            title: '首页',
        },
        {
            title: <a href="">工作台</a>,
        },
    ];
    const [open, setOpen] = useState(false);

    const Menus: MenuProps['items'] = [
        {
            label: '邮箱:yjwj1801@163.com',
            key: '1',
        },
        {
            label: '退出',
            key: '2',
        },
    ];
    return (
        <div className={style.flex_box}>
            <div className={style.left}>
                <MenuFoldOutlined />
                <Breadcrumb items={items} />
            </div>
            <div className={style.right}>
                <Switch checkedChildren="开启" unCheckedChildren="关闭" defaultChecked />
                <Dropdown
                    menu={{ items: Menus }}
                >
                    <a onClick={(e) => e.preventDefault()} className={style.set}>设置</a>
                </Dropdown>
            </div>
        </div>
    )
}
export default NavHeader;